/*
 * @Author: 杨涛 2749552387@qq.com
 * @Date: 2024-11-08 10:44:38
 * @LastEditors: 杨涛 2749552387@qq.com
 * @LastEditTime: 2024-11-08 10:45:08
 * @FilePath: \ue_vue3_vite\src\utils\useWindowSize.ts
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
// useWindowSize.js
import { ref, onMounted, onBeforeUnmount } from 'vue';

export function useWindowSize() {
  const windowWidth = ref(window.innerWidth);
  const windowHeight = ref(window.innerHeight);

  // 监听窗口大小变化
  const handleResize = () => {
    windowWidth.value = window.innerWidth;
    windowHeight.value = window.innerHeight;
  };

  // 在组件挂载时添加 resize 事件监听
  onMounted(() => {
    window.addEventListener('resize', handleResize);
  });

  // 在组件卸载时移除 resize 事件监听
  onBeforeUnmount(() => {
    window.removeEventListener('resize', handleResize);
  });

  // 返回当前的窗口宽度和高度
  return { windowWidth, windowHeight };
}
